import styles from './Header.module.scss';
import logo from './../../images/logo.svg';

import { Link, useLocation } from 'react-router-dom';
import { ROUTES } from '../../utils/conts';

const HeaderBase = () => {
  const location = useLocation();

  return (
    <header className={styles.header}>
      <Link to={ROUTES.HOME}>
        <div className={styles.logo}>
          <p>Weather-history</p>
        </div>
      </Link>
      {location.pathname === ROUTES.LOGIN || location.pathname === ROUTES.REGISTRATION ? null : (
        <div className={styles.login}>
          <ul>
            <Link to={ROUTES.REGISTRATION} className={styles.link}>
              Регистрация
            </Link>
            <Link to={ROUTES.LOGIN} className={styles.link}>
              Войти
            </Link>
          </ul>
        </div>
      )}
    </header>
  );
};

export default HeaderBase;
